<template>
	<view class="content">
		<view class="cu-form-group">
			<view class="title">回款编号</view>
			<input v-model="form.code" placeholder="请输入回款编号" name="input"></input>
		</view>
		
		<view class="cu-form-group between" >
			<view class="title">合同编号</view>
			<picker @change="contractPickerType" :disabled="disableSelect"  :value="contractSelect" range-key="name"  :range="contracts">
				<view class="picker">
					{{contractSelect>-1?contracts[contractSelect].name:'请选择合同'}}
				</view>
			</picker>
		</view>
		<view class="cu-form-group between" >
			<view class="title">客户名称</view>
			<view class="right-box" >
				<text class="name">{{customerName}}</text>
			</view>
		</view>
		<view class="cu-form-group">
			<view class="title">回款金额</view>
			<input v-model="form.money" type="number" placeholder="请输入回款金额" name="input"></input>
		</view>
		<view class="cu-form-group">
			<view class="title">回款类型</view>
			<picker @change="returnPickerType" :value="typeSelect" range-key="dictLabel" :range="receivablesType">
				<view class="picker">
					{{receivablesType[typeSelect]?receivablesType[typeSelect].dictLabel:'请选择回款类型'}}
				</view>
			</picker>
		</view>
		<view class="cu-form-group">
			<view class="title">回款时间</view>
			<picker mode="date" :value="form.returnTime" start="2020-01-01" end="2060-12-31" @change="returnTimeChange">
				<view class="picker">
					{{form.returnTime}}
				</view>
			</picker>
		</view>
		 
		<view class="cu-form-group align-start">
			<view class="title">备注</view>
			<textarea maxlength="-1" @input="textareaBInput" placeholder="请输入备注"></textarea>
		</view>
		<view class="btn-box">
			<view class="submit-btn" @click="submit">保存</view>
		</view>
	</view>
</template>
<script>
	import api from '@/api/api.js';
	export default {
		data() {
			return {
				disableSelect:false,
				contractId:undefined,
				customerName:undefined,
				contracts:[],
				contractSelect: -1, // 当前选中的记录类型
				receivablesType:[],
				typeSelect:-1,
				form:{
					code:undefined,
					contractId:undefined,
					customerId:undefined,
					returnTime:undefined,
					returnType:undefined,
					money:undefined,
					remark:undefined,
				}
			}
		},
		onLoad(options) {
			this.contractId = options.contractId
			// 修改顶部导航背景色
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: '#39b54a',
				animation: {
					duration: 400,
					timingFunc: 'easeIn'
				}
			})
			var dicts = uni.getStorageSync('dicts');
			dicts=JSON.parse(dicts);
			this.receivablesType=dicts['receivablesType'];
			let date = new Date();
			this.form.returnTime=this.utils.dateFormat("YYYY-mm-dd", date);
			 
			
		},
		onShow(){
			 //获取已通过的合同;
			 this.getMySuccessContractList();
			 
		},
		methods: {
			getMySuccessContractList(){
				var data = {};
				var that=this;
				api.getMySuccessContractList(data).then(
					res => {
						console.log(res);
						if(res.code==200){
							that.contracts=res.list;
							for(var i=0;i<that.contracts.length;i++){
								if(that.contracts[i].contractId==that.contractId){
									that.disableSelect=true;
									that.contractSelect = i;
									that.customerName=that.contracts[that.contractSelect].customerName;
								}
							}
						}else{
							uni.showToast({
								icon:'none',
								title: "请求失败",
							});
							that.dataList = null;
							mescroll.endErr();
							// that.mescroll.endSuccess(0);
						}
					},
					rej => {}
				);
			},
			contractPickerType(e) {
				this.contractSelect = e.detail.value
				this.customerName=this.contracts[this.contractSelect].customerName;
				
			},
			returnPickerType(e) {
				this.typeSelect = e.detail.value
				
			},
			returnTimeChange(e) {
				this.form.returnTime = e.detail.value
			},
			textareaBInput(e) {
				this.form.remark = e.detail.value
			},
			submit(){
				
				if (this.utils.isEmpty(this.form.code)) {
					uni.showToast({
						title: "请输入回款编号",
						icon: 'none',
					});
					return
				}
				if (this.typeSelect==-1) {
					uni.showToast({
						title: "请选择回款类型",
						icon: 'none',
					});
					return
				}
				console.log(this.contractSelect)
				if (this.contractSelect==-1) {
					uni.showToast({
						title: "请选择合同",
						icon: 'none',
					});
					return
				}
				 
				if (this.utils.isEmpty(this.form.money)) {
				 	uni.showToast({
				 		title: "请输入回款金额",
				 		icon: 'none',
				 	});
				 	return
				 }
				 if (this.utils.isEmpty(this.form.returnTime)) {
				  	uni.showToast({
				  		title: "请选择回款时间",
				  		icon: 'none',
				  	});
				  	return
				  }
				this.form.returnType=this.receivablesType[this.typeSelect].dictValue;
				this.form.contractId=this.contracts[this.contractSelect].contractId;
				this.form.customerId=this.contracts[this.contractSelect].customerId;
				api.addReceivables(this.form).then(
					res => {
						if(res.code==200){
							uni.showToast({
								title: '提交成功',
								duration: 2000
							});
							setTimeout(function() {
								uni.navigateBack({
								  success: () => {
								  }
								})
							}, 500);
						}
						else{
							uni.showToast({
								title: res.msg,
								icon: 'none',
							});
						}
					},
					rej => {}
				);
			}
		}
	}
</script>


<style scoped lang="scss">
	.content{
		margin-top: 20upx;
		.floow-cont{
			flex-direction: column;
			background-color: #ffffff;
			padding: 1rpx 30rpx;
			margin-top: 20upx;
			.title{
				text-align: justify;
				padding-right: 30upx;
				font-size: 30upx;
				position: relative;
				height: 60upx;
				line-height: 60upx;
			}
			textarea{
				width: 100%;
				height: 200upx;
				padding: 20upx 0;
			}
		}
	}
	.btn-box{
		padding: 20upx 24upx;
		.submit-btn{
			height: 80upx;
			line-height: 80upx;
			text-align: center;
			font-size: 28upx;
			color: #fff;
			border-radius: 8upx;
			background: #39b54a;
		}
	}
</style>
